<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>我的网站</title>
		<link rel="stylesheet" type="text/css" href="css/index/index.css"/>
			<style>
				* { margin: 0; padding: 0;}
				a{color: #000000;text-decoration: none;}
				a:hover{color: green;}
				.mytitle{text-align: center;}
				#dowebok { width: 90%; margin: 0 auto; font-size: 14px;}
				#dowebok li { float: left; width: 30%; margin-left: 1%; padding-top: 1%;}
				#dowebok li img { width: 70%;}
				#dowebok li .dt { width: 100%;text-align: center;}
				#dowebok li{ list-style-type: none;}
				
			</style>
	</head>

	<body>
		<h1 class="mytitle">179000646 唐渝</h1>
		<ul id="dowebok">
			<li>
				<div id="one" 
					onmousemove="document.getElementById('one').className='style1'" 
					onmouseout="document.getElementById('one').className='style0'">
					<a href="one.html"><img src="img/hei.jpg" alt="图片1"></a>
				</div>
				<div class="dt"><a href="one.html">作品1：网页</a></div>
			</li>
			<li>
				<div id="tow" 
					onmousemove="document.getElementById('tow').className='style2'" 
					onmouseout="document.getElementById('tow').className='style0'">
					<a href="two.html"><img src="img/hei.jpg" alt="图片2"></a></div>
				<div class="dt"><a href="two.html">作品2：布局</a></div>
			</li>
			<li>
				<div id="three" 
					onmousemove="document.getElementById('three').className='style3'" 
					onmouseout="document.getElementById('three').className='style0'">
					<a href="three.html"><img src="img/hei.jpg" alt="图片3"></a></div>
				<div class="dt"><a href="three.html">作品3：登录</a></div>
			</li>
			<li>
				<div id="four" 
					onmousemove="document.getElementById('four').className='style4'" 
					onmouseout="document.getElementById('four').className='style0'">
					<a href="js/four.html"><img src="img/hei.jpg" alt="图片4"></a></div>
				<div class="dt"><a href="js/four.html">作品4：JavaScript</a></div>
			</li>
			<li>
				<div id="five" 
					onmousemove="document.getElementById('five').className='style5'" 
					onmouseout="document.getElementById('five').className='style0'">
					<a href="task05.html"><img src="img/hei.jpg" alt="图片5"></a></div>
				<div class="dt"><a href="task05.html">作品5：DOM</a></div>
			</li>
			<li>
				<div id="six" 
					onmousemove="document.getElementById('six').className='style6'" 
					onmouseout="document.getElementById('six').className='style0'">
					<a href="five.html"><img src="img/hei.jpg" alt="图片6"></a></div>
				<div class="dt"><a href="five.html">作品6：时间</a></div>
			</li>
			<li>
				<div id="Seven" 
					onmousemove="document.getElementById('Seven').className='style7'" 
					onmouseout="document.getElementById('Seven').className='style0'">
					<a href="jquery4_task.html"><img src="img/hei.jpg" alt="图片7"></a></div>
				<div class="dt"><a href="jquery4_task.html">作品7：jQuery</a></div>
			</li>
			<li>
				<div id="Eight" 
					onmousemove="document.getElementById('Eight').className='style8'" 
					onmouseout="document.getElementById('Eight').className='style0'">
					<a href="task6.html"><img src="img/hei.jpg" alt="图片8"></a></div>
				<div class="dt"><a href="task6.html">作品8：事件</a></div>
			</li>
			<li>
				<div id="Nine" 
					onmousemove="document.getElementById('Nine').className='style9'" 
					onmouseout="document.getElementById('Nine').className='style0'">
					<a href="nine.html"><img src="img/hei.jpg" alt="图片9"></a></div>
				<div class="dt"><a href="nine.html">作品9：购物车</a></div>
			</li>
			<li>
				<div id="ten" 
					onmousemove="document.getElementById('ten').className='style10'" 
					onmouseout="document.getElementById('ten').className='style0'">
					<a href="ten.html"><img src="img/hei.jpg" alt="图片10"></a></div>
				<div class="dt"><a href="ten.html">作品10：孙悟空</a></div>
			</li>
			<li>
				<div id="eleven" 
					onmousemove="document.getElementById('eleven').className='style11'" 
					onmouseout="document.getElementById('eleven').className='style0'">
					<a href="eleven.html"><img src="img/hei.jpg" alt="图片11"></a></div>
				<div class="dt"><a href="eleven.html">作品11：豆瓣电影</a></div>
			</li>
			<li>
				<div id="twelve" 
					onmousemove="document.getElementById('twelve').className='style12'" 
					onmouseout="document.getElementById('twelve').className='style0'">
					<a href="#"><img src="img/hei.jpg" alt="图片12"></a></div>
				<div class="dt"><a href="#">作品12：专业加载中...</a></div>
			</li>
			
		</ul>
		
	</body>
	
</html>